{__NOLAYOUT__}
<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <title>3D 全景示例</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <link rel="stylesheet" href="__COMMON__/css/common.min.css">
    <link rel="stylesheet" href="__STYLE__/House/css/house.css">
    <style type="text/css">
     html,body { height:100%; width:100%; overflow:hidden; }
     body { padding-bottom:0; }
     footer { display:none; }
     .return { position:absolute; bottom:10px; left:10px; z-index:1000; background:#fff; padding:5px; border-radius:50%; }
     .return img { width:25px; }
    </style>  
  </head>
  <body>
    <script type="text/javascript" src="__COMMON__/js/player.js"></script>
    <div id="container" style="width:100%;height:100%;"></div>
    <div class="scene-title"><h4>{$house.name}{$houseScene.houseType.name}</h4></div>
    <div class="scene-list" id="scene-list">
      <ul>
      <tag:houseScene id="vo">
        <li><a href="{$vo.url}" class="{$houseScene['id']==$vo['id']?'active':''}">{$vo.name}</a></li>
      </tag:houseScene>
      </ul>
      <a class="toggle-scene" id="toggle-scene">切换场景</a>
    </div>
    <div class="return">
      <a onclick="javascript:history.go(-1)"><img src="data:image/svg+xml;charset=US-ASCII,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22iso-8859-1%22%3F%3E%3C!DOCTYPE%20svg%20PUBLIC%20%22-%2F%2FW3C%2F%2FDTD%20SVG%201.1%2F%2FEN%22%20%22http%3A%2F%2Fwww.w3.org%2FGraphics%2FSVG%2F1.1%2FDTD%2Fsvg11.dtd%22%3E%3Csvg%20version%3D%221.1%22%20id%3D%22Layer_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20%20width%3D%2214px%22%20height%3D%2214px%22%20viewBox%3D%220%200%2014%2014%22%20style%3D%22enable-background%3Anew%200%200%2014%2014%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cpolygon%20fill%3D%22%23000%22%20points%3D%227%2C5%207%2C0%200%2C7%207%2C14%207%2C9%2014%2C9%2014%2C5%20%22%2F%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3Cg%3E%3C%2Fg%3E%3C%2Fsvg%3E"></a>
    </div>
    <script type="text/javascript">
      pano=new pano2vrPlayer("container");
      pano.readConfigUrl("{$configUrl}");
    </script>
    <script type="text/javascript">
       // hide URL field on the iPhone/iPod touch
      function hideUrlBar() {
         document.getElementsByTagName("body")[0].style.marginTop="1px";
         window.scrollTo(0, 1);
       }
       window.addEventListener("load", hideUrlBar);
       window.addEventListener("resize", hideUrlBar);
       window.addEventListener("orientationchange", hideUrlBar);
       
       //toggle scene
      var toggleScene = document.getElementById( "toggle-scene" ),
           sceneList = document.getElementById( "scene-list" ).children[0];
       toggleScene.onclick = function () {
         var display = window.getComputedStyle( sceneList, false ).display;
         display == "block" ? (sceneList.style.display = "none") : (sceneList.style.display = "block");
       }
    </script>
  </body>
</html>
